<template>
	<div class="port-page">
		<!-- 顶部按钮 -->
		<div class="but1">
		<div style="float: left;">
		 <router-link to="/home">
			<el-button type="warning" size="small"   style='margin-right: 5px;' icon="el-icon-menu">首页</el-button>
		</router-link>
		<router-link :to="{path:'/home',query: {id:vbjid,frompage:'kq'}}">
			<el-button type="warning" size="small"   style='margin-right: 5px;' icon="el-icon-caret-left">返回</el-button>
			 <!--<el-button type="primary" size="small" @click="$router.back(-1);"  style='margin-right: 10px;' icon="menu">返回</el-button>-->
		</router-link>
		<div class="search-item">
				<span>day</span>
				<el-select  v-model="vday" @change="search" class="code-search" placeholder="请选择day">
					<el-option :label="v.daymc" :value="v.day" v-for="v in comboxlistday"></el-option>
				</el-select>
			</div>
		</div>	
		<div style="float: left;margin-left: 5px;margin-top: 10px;" v-if="this.info.ifkq=='Y'">
		<el-button type="danger" size="small" @click='zf()'>作废</el-button>
		</div>
		
		<div style="float: left;margin-left: 5px;margin-top: 10px;"v-if="this.info.ifkq=='N'">
		<el-button type="success" size="small" v-if='butshow' @click='kaoqinsave("1")'>主教考勤</el-button>
		<el-button type="success" size="small" v-if='butshow' @click='wjkq'>外教考勤</el-button>
		</div>
	</div>
	<!--选择外交老师-->
	<div>
		<el-dialog title="外教考勤" width="40%" :visible.sync="showwjkq"  :close-on-click-modal="false">
			<el-form label-width="40%" >
					<el-form-item label="外教老师">
						<el-select v-model="vwjlsid" placeholder="请选择外教老师" class="select-block">
							<el-option :label="v.zwm" :value="v.id+''" v-for="v in wjlslist"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="考勤时长">
						<el-input v-model="vkss" type="number" placeholder="请输入考勤时长( 分钟 )"  class="select-block"></el-input>
					</el-form-item>
			</el-form>
			<div style="width: 100%; text-align: center;">
				<el-button type="success" @click='kaoqinsave("2")'>保存</el-button>
				<el-button type="warning" @click='showwjkq = false'>返回</el-button>
			</div>
		</el-dialog>
	</div>
	
	<div style="width: 100%;float: left;">
		<div class="total">
					<p style="font-size: 20px;">考勤详情</p>
					<br/>
					<span v-if="this.info.ifkq=='Y'" >考勤类型：<span style="color: red;" v-if="this.info.ifkq=='Y'">{{this.info.lstype}}</span></span>
					<span v-if="this.info.ifkq=='Y'" >考勤老师：<span style="color: red;" v-if="this.info.ifkq=='Y'">{{this.info.lszwm}}</span></span>
					<span v-if="this.info.ifkq=='Y'" >考勤时间：<span style="color: red;" v-if="this.info.ifkq=='Y'">{{this.info.kqsj}}</span></span>
					<span v-if="this.info.ifkq=='Y' && this.info.lstype=='外教考勤'" >外教老师：<span style="color: red;" v-if="this.info.ifkq=='Y'">{{this.info.wjzwm}}</span></span>
                    <span v-if="this.info.ifkq=='Y' && this.info.lstype=='外教考勤' " >外教时长：<span style="color: red;" v-if="this.info.ifkq=='Y'">{{this.info.wjsc}}</span></span>
					<span style="font-size: 20px;color: red;" v-if="this.info.ifkq=='N'">暂无考勤!!!</span>
                    <!--v-if="this.info.ifkq=='N'"-->
					<!-- </div> -->
				</div>
		<p style="float: left;margin-bottom: 10px;font-size: 15px;color: red;">注：考勤后可以单独修改学生出勤状态，单独修改考勤会引起学生课消的变化，请谨慎操作!</p>		
	</div>
		<!-- 数据表格展示区域 -->
		<el-table :data="dataList"
			stripe border
			size="small"
			 align="center"
			class="admin-table"
			@select="checkSelect"
			 @select-all="checkall">
			<div slot='empty'>
				<img src="../../../assets/img/empty.png" style="width:40px;vertical-align: middle;">
				<span style="vertical-align: middle;">暂时还没有内容哦!</span>
			</div>
			<el-table-column :prop="v.prop" :label="v.label" v-for="(v,index) in portTitleList" align="center" show-overflow-tooltip v-if="v.hide != 0" :formatter="v.formatter" :align="v.align || 'center'" :fixed="v.fixed" :class-name="v.columnStyle" :width="v.width" :min-width="v.minWidth" :header-align="v.headerAlign || 'center'">
				<template scope="scope">
                    <div slot="reference">
                        <div v-if="scope.column.property == 'name'" @click="componentsShow('info',scope)">
                            <img
                            :src="scope.row.xb == '男' ? $store.state.sexImg.boy : $store.state.sexImg.girl"
                            style="width:20px;vertical-align:middle; float: left;"
                            v-if="scope.column.property == 'name'">
                            <span style="vertical-align:middle;">{{ scope.row[scope.column.property] }}</span>
                        </div>
                        <span style="vertical-align:middle;" v-else>{{ scope.row[scope.column.property] }}</span>
                    </div>
                </template>
			</el-table-column>
			<el-table-column label="出勤状态"  align="center">
				<template scope="scope">
					<el-button size="mini" :type="(scope.row.cqzt==1?'primary':(scope.row.cqzt==2?'warning':(scope.row.cqzt==3?'danger':'info')))"   @click="kaoqin(scope)">{{scope.row.cqzt==5? '休学':scope.row.kqztmc}}</el-button>
					</template>
			</el-table-column>
			<el-table-column label="操作" width="220" align="center">
				<template scope="scope">
					<el-button size="mini" type="danger" v-if='butshow1' :disabled="scope.row.cqzt == '5'" @click="dgqxkq(scope)" >修改考勤{{scope.row.ifxx}}</el-button>
					<el-button size="mini" type="" v-if="scope.row.iskq == '未考勤'" disabled >未考勤</el-button>
					<el-button size="mini" type="text" v-if="false" @click="componentsShow('singleDelete',scope)">删除</el-button>
					<el-button size="mini" type="primary" v-if="scope.row.pjzt == '1'"  @click="componentsShow('edit',scope)">评价</el-button>
					<el-button size="mini" type="warning" disabled v-if="scope.row.pjzt == '已安排补课'" >已安排补课</el-button>
					<el-button size="mini" type="danger" disabled v-if="scope.row.pjzt == '补课完成'" >补课完成</el-button>
					<el-button size="mini" type="primary" v-if="scope.row.pjzt == '2'"   @click="componentsShow('buke',scope)">补课</el-button>
					<el-button size="mini" type="primary" v-if="scope.row.pjzt == '3'"   @click="componentsShow('pjinfo',scope)">查看评价</el-button>
					</template>
			</el-table-column>
		</el-table>
		<!-- 各个组件显示区域 -->
		<!-- 动画加载 -->
		<LoadingComponent v-show="isLoading"></LoadingComponent>
		<PjinfoComponent v-if="portComponents.pjinfo.toggle"   @close="componentsHide"  :params="portComponents.pjinfo.params"></PjinfoComponent>
		<!-- 添加组件 -->
		<AddComponent v-if="portComponents.add.toggle" @close="componentsHide"></AddComponent>
		<!-- 编辑组件 -->
		<EditComponent v-if="portComponents.edit.toggle" @close="componentsHide" :params="portComponents.edit.params"></EditComponent>
		<!-- 添加补课组件 -->
		<infoComponent v-if="portComponents.info.toggle" @close="componentsHide" :params="portComponents.info.params"></infoComponent> 
		<BukeComponent v-if="portComponents.buke.toggle" @close="componentsHide" :params="portComponents.buke.params"></BukeComponent>
		<!-- 学生详情组件 -->
		<XxxqComponent v-if="portComponents.xxxq.toggle" @close="componentsHide" :params="portComponents.xxxq.params"></XxxqComponent>
		<KqztComponent v-if="portComponents.kqzt.toggle" @close="componentsHide" :params="portComponents.kqzt.params"></KqztComponent>
		<!-- 单独删除组件 -->
		<DeleteComponent v-if="portComponents.singleDelete.toggle" @close="componentsHide" :data="portComponents.singleDelete.data"></DeleteComponent>
		<!-- 批量删除组件 -->
		<DeleteComponent v-if="portComponents.multipleDelete.toggle" @close="componentsHide" :data="portComponents.multipleDelete.data"></DeleteComponent>
		<!-- 子路由显示区域 -->
		<router-view class="port-view"></router-view>
	</div>
</template>
<script>
	import { mapState } from 'vuex'
	import LoadingComponent from 'components/loading'
	import AddComponent from './add'
	import EditComponent from './edit'
	import KqztComponent from './kqzt'
	import InfoComponent from 'view/educa/classManage/student/info'
	import BukeComponent from 'components/xzhomezj/buke/bkap'
	import DeleteComponent from './del'
	import XxxqComponent from './xxxq'
	import PjinfoComponent from './pjinfo'
	import qs from 'qs'
	export default {
		components: { LoadingComponent,KqztComponent,XxxqComponent,InfoComponent, DeleteComponent, AddComponent, EditComponent, BukeComponent,PjinfoComponent },
		data() {
			return {
				/*模糊搜索条件*/
				info: {
					lstype: '',
					kqsj: '',
					ifkq: '',
					lszwm: '',
					wjsc: '',
					wjls: '',
					skls: '',
					lsywm: '',
				},
				vkss:'',
				bjmc:'',
				wjlslist:[],
				vwjlsid:'',
				showwjkq:false,
				vbjid:this.$route.query.iid+'', // 班级id
				vday: '',
				lx:'Y',
				butshow:true,
				butshow1:false,
				multipleDelNum: '', //获取批量选择的数据
				dataList: [], //表格数据
				comboxlist: [], //下拉框 动态的
				comboxlistday: [],
				vcomautovalue: '', //下拉框name 动态的
				vcomgdvalue: '', //下拉框name 固定的
				/*动画加载*/
				isLoading: true, //动画加载
				searchLoading: false, //搜索按钮触发按钮动画
				/*分页属性设置*/
				layout: 'total, sizes, prev, pager, next, jumper', //组件布局
				pageindex: this.$store.state.pageindex, //当前分页页码
				pagesizes: this.$store.state.pagesizes, //显示个数的选择器选项
				pagesize: this.$store.state.pagesize, //每页显示条目数
				total: 0, //总条数
				/*组件区域*/
				portComponents: {
					/* 单行删除  */
					singleDelete: {
						type: 'singleDelete',
						toggle: false,
						params: '',
						data: {
							index: '',
							type: 'single',
							title: '此操作将删除该记录?, 是否继续?'
						}
					},
					/* 批量删除 */
					multipleDelete: {
						type: 'multipleDelete',
						toggle: false,
						params: '',
						data: {
							index: '',
							type: 'multiple',
							title: '此操作将删除您选中的记录?, 是否继续?'
						}
					},
					pjinfo: {
							type: 'pjinfo',
							toggle: false,
							params: '',
							data: {}
					},
					/* 添加 */
					add: {
						type: 'add',
						toggle: false,
						params: '',
						data: {}
					},
					/* 编辑 */
					edit: {
						type: 'edit',
						toggle: false,
						params: '',
						data: {}
					},
					/* info */
					 info: {
					 	type: 'info',
					 	toggle: false,
					 	params: '',
					 	data: {}
					 },
					/* info */
					buke: {
						type: 'buke',
						toggle: false,
						params: '',
						data: {}
					},
					xxxq: {
						type: 'xxxq',
						toggle: false,
						params: '',
						data: {}
					},
					kqzt: {
						type: 'kqzt',
						toggle: false,
						params: '',
						data: {}
					}
				},
				/*
				    prop :  接口参数名
				    label : 接口中文名
				    hide : 是否隐藏这一列
				    align : 这一列对齐顺序 ： left,right,center
				    headerAlign : 这一列表头对齐方式 ： left,right,center
				*/
				portTitleList: [
					{
						prop: 'name',
						label: '学生名字',
						hide: 1,
						align: 'center',
						fixed: false,
						width: '',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},
					{
						prop: 'ename',
						label: '英文名',
						hide: 0,
						align: 'center',
						fixed: false,
						width: '',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},
					{
						prop: 'day',
						label: 'day',
						hide: 1,
						align: 'center',
						fixed: false,
						width: '',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},
					{
						prop: 'kqsj',
						label: '考勤时间',
						hide:1,
						align: 'center',
						fixed: false,
						width: '180',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},
					{
						prop: 'kqlx',
						label: '考勤类型',
						hide: 1,
						align: 'center',
						fixed: false,
						width: '',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},
					{
						prop: 'skls',
						label: '老师',
						hide: 1,
						align: 'center',
						fixed: false,
						width: '',
						minWidth: '',
						headerAlign: 'center',
						formatter: function(row, column) {}
					},

				]

			}
		},
		created() {
			if(this.$route.query.bjmc){
              this.bjmc = this.$route.query.bjmc
            }
			this.searchLoading = false;
			//加载页面时调用
			this.$store.dispatch('changeTitle',this.bjmc+ '班级考勤'); //修改title
			this.$store.dispatch('changeRouterIndex', '/educa/check'); //修改路由
			this.getcomlist(); //加载下拉列表
			this.getcomxqlist(); //加载下拉列表
			this.getcomlist2();
			this.getbutton();
//			if(this.$route.query.bjid) {
//				if(this.$route.query.frompage == 'home') {
//       			 this.vbjid=this.$route.query.bjid;
//				}
//			}
			 // this.search();//分页获取默认数据
			//  this.isLoading = true;//动画开始
		},
		mounted() {
			//加载完成之后event
			this.isLoading = false; //动画结束

		},
		methods: {
		cancelf () {
	          this.$store.dispatch('changeTitle','首页');//修改title
          },
       
			getwjlslist() {
				var logininfo = JSON.parse(localStorage.logininfo);
             	var params2 = qs.stringify({
                      yhid: logininfo.id + '',
                })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/getwjls',  params2 )
                 .then(res => {
                    let data = res.data.data;
					let list = data.list;
					this.wjlslist = list;
                 }).catch(res => {
				})
			},
			dgqxkq(scope){
				 this.$confirm('确认是否修改该学生的考勤吗？', '提示',{
				 	confirmButtonText: '确定',
					 cancelButtonText: '取消',
					 type: 'warning'
				 })
		          .then(_ => {
		            var logininfo = JSON.parse(localStorage.logininfo);
	 				var params2 = qs.stringify({
	 					yhid: logininfo.id + '',
	 					xxid: logininfo.xxid + '',
	 					bjid: this.vbjid + "", // 班级id
	 					day: this.vday + '', //课次
	 					xsid:scope.row.xsid,
	 					zt:scope.row.cqzt,
	 				})
	 				//执行
	 				this.axios.post(this.$store.state.api + 'kqjl/xgkq', params2)
	 					.then(res => {
	 						if(res.data.code == 1) {
	 							this.$message.warning(res.data.msg)
	 							this.search();
	 						} else {
	 							this.$message.warning(res.data.msg)
	 						}
	 					}).catch(res => {
	 						this.$message.warning("服务器异常");
	 					})
		          })
         		 .catch(_ => {
         		 	this.$message({
						 type: 'info',
						 message: '已取消操作'
					 });
         		 });
			
			},
			zf(){
          	this.$confirm('确认是否作废该day的考勤？', '提示',{
				 	confirmButtonText: '确定',
					 cancelButtonText: '取消',
					 type: 'warning'
				 })
          	  .then(_ => {
			 //方法 
          	var logininfo = JSON.parse(localStorage.logininfo);
             var params2 = qs.stringify({
                             xxid:logininfo.xxid,
 							 yhid:logininfo.id,
 							 day:this.dataList[0].day,
 							 bjid:this.dataList[0].bjid
               })
             //执行
                 this.axios.post(this.$store.state.api + 'kqjl/kqzf',  params2 )
                 .then(res => {
                 	if(res.data.code == 1) {
	 							this.$message.success(res.data.msg)
	 							this.search();
	 						} else {
	 							this.$message.warning(res.data.msg)
	 						}
                 }).catch(res => {
					this.$message.error("服务器异常");
				})	
				//
				
			})
         		 .catch(_ => {
         		 	this.$message({
						 type: 'info',
						 message: '已取消操作'
					 });
         		 });	
          	
          },
			wjkq(){
				this.showwjkq = true
				this.getwjlslist()
			},
			kaoqinsave(lxtype) {
				this.$confirm('确认是否考勤?', '提示', {
					 confirmButtonText: '确定',
					 cancelButtonText: '取消',
					 type: 'warning'
				 }).then(() => {
					 // lxtype  1 =主教 2=助教
	 				var qkstr = "";
	 				this.dataList.forEach(function(v, i) {
	 					qkstr = v.xsid + "," + v.cqzt + ";" + qkstr;
	 				})
	 				if(qkstr == '') {
	 					this.$message.warning('没有找班级学生,不能考勤');
	 					return;
	 				}
	 				var logininfo = JSON.parse(localStorage.logininfo);
	 				var params2 = qs.stringify({
	 					wjid:this.vwjlsid,
	 					wjsc:this.vkss,
	 					yhid: logininfo.id + '',
	 					xxid: logininfo.xxid + '',
	 					bjid: this.vbjid + "", // 班级id
	 					day: this.vday + '', //课次
	 					kqlx: lxtype, //考勤类型
	 					qkstr: qkstr+''
	 				})
	 				//执行
	 				this.axios.post(this.$store.state.api + 'kqjl/updatekq', params2)
	 					.then(res => {
	 						if(res.data.code == 1) {
//	 							console.log(res,1111)
	 							this.showwjkq = false
	 							this.$message.success("考勤成功!")
	 							this.search();
	 						} else {
	 							this.$message.warning(res.data.msg)
	 						}
	 					}).catch(res => {
	 						this.$message.error("服务器异常");
	 					})


				 }).catch(() => {
					 this.$message({
						 type: 'info',
						 message: '已取消'
					 });
				 });

			},
			kaoqin(scope) {
				if(this.info.ifkq == "Y"){
//					this.Eitkq(scope)
                    this.portComponents.kqzt.toggle=true
                    this.portComponents.kqzt.params=scope
				}else{
					if(scope.row.cqzt == 1){
						scope.row.cqzt = 2;
						scope.row.kqztmc="缺勤"
					}else if(scope.row.cqzt == 2){
						scope.row.cqzt = 3;
						scope.row.kqztmc="迟到"
					}else if(scope.row.cqzt == 3){
						scope.row.cqzt = 1;
						scope.row.kqztmc="出勤"
					}
				}
			},
			Eitkq(list) {
				 var logininfo = JSON.parse(localStorage.logininfo);
	             var params2 = qs.stringify({
		             	xsid:list.row.xsid,
						day:list.row.day,
						kqzt:list.row.cqzt,
						lsid:logininfo.id,
						lstype:1,
						bjid:list.row.bjid,
	                    yhid: logininfo.id + '',
						xxid: logininfo.xxid + ''
	               })
	             //执行
	                 this.axios.post(this.$store.state.api + 'kqjl/updatekq1',  params2 )
	                 .then(res => {
	                 	console.log(res)
	                 }).catch(res => {
					})
			},
			getcomlist() {
				var logininfo = JSON.parse(localStorage.logininfo);
             var params2 = qs.stringify({
                      yhid: logininfo.id + '',
						xxid: logininfo.xxid + ''
               })
             //执行
                 this.axios.post(this.$store.state.api + 'bj/getbj',  params2 )
                 .then(res => {
                 let data = res.data.data;
					let list = data.list;
					this.comboxlist = list;
                 }).catch(res => {
				})
			},
			getcomxqlist() {
				var logininfo = JSON.parse(localStorage.logininfo);
                var params2 = qs.stringify({
             	      day:this.vday,
             	      bjid:this.vbjid,
                      yhid: logininfo.id + '',
					  xxid: logininfo.xxid + ''
               })
             //执行
                 this.axios.post(this.$store.state.api + 'kqjl/bjkq',  params2 )
                 .then(res => {
//               	console.log(res,'ooooooooo')
					this.info = res.data.data.list[0];
                 }).catch(res => {
				})
			},
			getcomlist2() {
				var logininfo = JSON.parse(localStorage.logininfo);
             var params2 = qs.stringify({
                  yhid: logininfo.id,
					xxid: logininfo.xxid,
					bjid: this.vbjid, // 班级id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'kqjl/Webkqjlgetday',  params2 )
                 .then(res => {
					let data = res.data.data;
					let list = data.list;
					this.comboxlistday = list;
					this.vday = this.comboxlistday[0].day
					this.search();
                 }).catch(res => {
				})
			},
			search() {
			  var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
              var params2 = qs.stringify({
                      yhid: logininfo.id,
						xxid: logininfo.xxid,
						bjid: this.vbjid, // 班级id
						day: this.vday,
						keyword:''
               })
                 this.axios.post(this.$store.state.api + 'kqjl/getbjkqjl',  params2 )
                 .then(res => {
                 	console.log(res,'sddd')
                 	this.getcomxqlist();
									let list = res.data.data.list;
									this.dataList = list;
									this.total = data.totalPage;
									this.searchLoading = false;
									this.lx = res.data.button;
									this.xsid=res.data.data.list[0].xsid;
									this.day=res.data.data.list[0].day;
									this.bjid=res.data.data.list[0].bjid;
									
									this.getbutton();
                 }).catch(res => {
                  this.searchLoading = false;
				})
			},
			getbutton() {
			  var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
              var params2 = qs.stringify({
                      yhid: logininfo.id,
						xxid: logininfo.xxid,
						bjid: this.vbjid, // 班级id
						day: this.vday,
               })
             //执行
                 this.axios.post(this.$store.state.api + 'kqjl/xsan',  params2 )
                  .then(res => {
                  	if(res.data.data.list[0].button=='Y'){
	                  	this.butshow=true
                  	}else if(res.data.data.list[0].button=='N'){
                  		this.butshow=false
                  	}
                  	 if(res.data.data.list[0].button1=='Y'){
	                  	this.butshow1=true
                  	}else if(res.data.data.list[0].button1=='N'){
                  		this.butshow1=false
                  	}
					this.searchLoading = false;
                 }).catch(res => {
                  this.searchLoading = false;
				})
			},
			tableCellControl(scope) {
				//表格单元格控制CSS样式
				/*if (scope.row.id == 112 && scope.column.property == "iname") {
				    return {
				        color:"red",
				    }
				}else{
				    return {
				        color:"green",
				    }
				}*/
			},
			handleSizeChange(val) { //每页显示条数触发事件
				this.pagesize = val;
				this.pageindex = 1;
				this.search();
			},
			handleCurrentChange(val) { //分页触发事件
				this.search();
			},
			checkSelect(selection, row) { //点击单选select触发事件
				// console.log(selection, row)
				let strID = [];
				selection.forEach(function(v, i) {
					strID.push(v.id)
				})
				this.multipleDelNum = strID.join(",");
			},
			checkall(selection) { //点击全选select触发事件
				let strID = [];
				selection.forEach(function(v, i) {
					strID.push(v.id)
				})
				this.multipleDelNum = strID.join(",");
			},
			/* 组件的弹框  */
			componentsShow(type, data) { //显示组件
				// console.log(type,data)
				for(let i in this.portComponents) {
					if(type == this.portComponents[i].type) {
						this.portComponents[i].toggle = true;
						this.portComponents[i].params = data;
						if(this.portComponents[i].data.type == 'single') {
							this.portComponents[i].data.index = data.row.id
						} else if(this.portComponents[i].data.type == 'multiple') {
							this.portComponents[i].data.index = this.multipleDelNum;
						} else {
							return;
						}
						return;
					}
				}
			},
			componentsHide(setting) { //关闭组件
				// console.log(setting)
				this.search();
				this.portComponents.buke.toggle = false
				for(let i in this.portComponents) {
					if(setting.type == this.portComponents[i].type) {
						this.portComponents[i].toggle = false;
						if(!setting.cancel) {
							this.search();
						}
						return;
					}
				}
			}
		},
		computed: {
			...mapState([
				'api' //域名
			]),
			multipleDeleteDisabled() {
				// console.log(this.multipleDelNum)
				if(this.multipleDelNum) {
					return false;
				} else {
					return true
				}
			}
		}
	}
</script>

<style lang="less" scoped>
.ys{
	color: #FF4949;
}

.ys2{
	color: #F7BA2A;
}
.select-block{
	width: 60%;
}
	.port-page {
		font-size: 12px;
		.btn {
			height: 30px;
			padding: 0 10px;
			margin-left: 0;
		}
		.code-search {
			height: 30px;
			margin: 10px 0 10px 0;
			min-width: 120px;
            max-width: 150px;
		}
		.class-page {
			text-align: left;
			margin-top: 10px;
		}
		.search-item {
			display: inline-block;
			/*margin-right: 10px;
			margin-bottom: 10px;
			margin-top: 10px;*/
		}
		.but1{
			width: 100%;
			height: 50px;
			float: left;
		}
		.search{
			width: 60%;
			float: right;
			text-align: right;
		}
		.el-button+.el-button {
            margin-left: 5px;
        }
        .total {
        	width: 100%;
		text-align: left;
		float: left;
		margin: 20px 0;
		font-size: 15px;
		span {
			margin: 0 10px;
		}
		p {
			// font-size: 20px;
			margin: 0 10px;
		}
	}
	
	.total2 {
		width: 40%;
		text-align: left;
		float: right;
		margin: 20px 0;
		font-size: 15px;
		span {
			margin: 0 10px;
		}
		p {
			margin: 0 10px;
		}
	}

	}
</style>
